<template>
  <div id="app">
    <List :msg="db"/>
  </div>
</template>

<script>
import List from './components/List.vue'
export default {
  name: 'App',
  components: {
    List
  },
  data() {
    return {
      timer:0,
      db:[]
    }
  },
  methods: {
    async getDB(){
     const {status,data} = await this.$axios.get('/test.json')
     if(status === 200){
       this.db = data
     }else{
       this.db =[]
     }
    }
  },
  mounted() {
    this.getDB()
    this.timer = setInterval(async () => {
      this.getDB()
    }, 1000*30);
  },
  deactivated() {
    clearInterval(this.timer)
  },
}
</script>

<style>
#app {
  font-family: Avenir, Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-align: center;
  font-size: 0.16rem;
}
</style>
